<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			.dox li{
				list-style:none;
			}
			
			.box li{				list-style:none;			}
			.aox li{				list-style:none;			}
		</style>
	</head>
	<body>
		 <div class="content">
		        <div class="logo">
		            <!-- <img src="../dd_logo.jpg"><span>关闭</span -->>
		        </div>
		        <div class="cartList">
		            <ul class="dox">
		                <li>¥<input type="text" name="price" value="21.90"></li>
		                <li><input type="button" name="minus" value="-"><input type="text" name="amount" value="1"><input type="button"
		                        name="plus" value="+"></li>
		                <li id="price0">¥21.90</li>
		                <li>
		                    <p>移入收藏</p>
		                    <p>删除</p>
		                </li>
		            </ul>
		            <ul class="box">
		                <li>¥<input type="text" name="price" value="24.00"></li
            <li><input type="button" name="minus" value="-"><input type="text" name="amount" value="1"><input type="button"
		                        name="plus" value="+"></li>
		                <li id="price1">¥24.00</li>
		                <li>
		                    <p>移入收藏</p>
		                    <p>删除</p>
		                </li>
		            </ul>
		            <ol class="aox
					
					aox">
		                <li id="totalPrice">&nbsp;</li>
		                <li><span>结 算</span></li>
		            </ol>
		        </div>
		    </div>
		    <script>
		        var plusbtn = document.getElementsByName("plus");
		        var amounts = document.getElementsByName("amount")
		        var minusbtn = document.getElementsByName("minus")
		        var totalPrice1 = document.getElementById("totalPrice");
		        function jiesuan() {
		            var total = 0;
		            for (let i = 0; i < 2; i++) {
		                var priceEle = document.getElementById("price" + i)
		                total = total + parseFloat(priceEle.innerHTML.substring(1))
		            }
		            totalPrice1.innerHTML = "￥" + total
		        }
		
		        for (let i = 0; i < plusbtn.length; i++) {
		            let priceEle = document.getElementById("price" + i)
		            let price = priceEle.innerHTML.substring(1)
		
		            plusbtn[i].onclick = function () {
		                amounts[i].value++
		                priceEle.innerHTML = "￥" + (price * amounts[i].value).toFixed(2)
		                jiesuan()
		            }
		        }
		        for (let i = 0; i < minusbtn.length; i++) {
		            let priceEle = document.getElementById("price" + i)
		            let price = priceEle.innerHTML.substring(1)
		            minusbtn[i].onclick = function () {
		                if (amounts[i].value > 1) {
		                    amounts[i].value--
		                    priceEle.innerHTML = "￥" + (price * amounts[i].value).toFixed(2)
		                    jiesuan()
		                } else {
		                    alert("商品的数量不能小于1")
		                }
		
		
		
		            }
		        }
		    </script>
	</body>
</html>
